<template>
	<a-modal
		:title="title"
		:width="modalWidth"
		:bodyStyle="bodyStyle"
		:visible="visible"
		:confirmLoading="confirmLoading"
		@ok="handleOk"
		@cancel="handleCancel"
		:destroyOnClose="true"
		:maskClosable="false"
	>
		<a-spin :spinning="confirmLoading">
			<a-form :form="form" autocomplete="off" :labelCol="labelCol" :wrapperCol="wrapperCol">
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="区域">
					<a-select
						placeholder="区域"
						v-decorator="[
							'areaCode',
							{
								rules: [{ required: true, message: '区域' }]
							}
						]"
					>
						<a-select-option :value="item.code" v-for="(item, index) in areaList" :key="index">{{ item.name }}</a-select-option>
					</a-select>
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="学校名称">
					<a-input
						placeholder="学校名称"
						v-decorator="[
							'schoolName',
							{
								rules: [{ required: true, whitespace: true, message: '学校名称' }],
								getValueFromEvent: removeSpaces
							}
						]"
					/>
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="专业">
					<a-select
						placeholder="专业"
						v-decorator="[
							'majorCode',
							{
								rules: [{ required: true, message: '专业' }]
							}
						]"
					>
						<a-select-option :value="item.code" v-for="(item, index) in majorList" :key="index">{{ item.name }}</a-select-option>
					</a-select>
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="批次类型">
					<a-radio-group
						v-decorator="[
							'earlyNormalApproval',
							{
								rules: [{ required: true, message: '专业' }]
							}
						]"
					>
						<a-radio value="approval_early">提前批</a-radio>
						<a-radio value="approval_normal">正常批</a-radio>
						<a-radio value="approval_both">正常和提前批</a-radio>
					</a-radio-group>
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="国家线">
					<a-select
						placeholder="国家线"
						v-decorator="[
							'nationalLine',
							{
								rules: [{ required: true, message: '国家线' }]
							}
						]"
					>
						<a-select-option value="line_A">A线</a-select-option>
						<a-select-option value="line_B">B线</a-select-option>
					</a-select>
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="提前批参加面试">
					<a-textarea class="w100" placeholder="提前批参加面试" v-decorator="['adviseBothYes']" />
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="提前批未参加面试">
					<a-textarea class="w100" placeholder="提前批未参加面试" v-decorator="['adviseBothNo']" />
				</a-form-item>
				
				<a-form-item label="无提前批面试"><a-textarea class="w100" placeholder="无提前批面试" v-decorator="['adviseSingle']" /></a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="排序"><a-input-number class="w100" placeholder="排序" v-decorator="['sort']" /></a-form-item>
				<a-form-item label="成绩分析">
					<a-upload
						v-decorator="[
							'scoresAnalysis',
							{
								valuePropName: 'fileList',
								getValueFromEvent: normPicListFile
							}
						]"
						name="file"
						:action="uploadFile"
						:multiple="true"
						list-type="picture-card"
						class="avatar-uploader"
						:headers="headers"
					>
						<div>
							<a-icon type="plus" />
							<div class="ant-upload-text">上传成绩分析图片</div>
						</div>
					</a-upload>
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="调剂信息详情">
					<a-textarea class="w100" placeholder="调剂信息详情" v-decorator="['dispensingDetail']" />
				</a-form-item>
			</a-form>
		</a-spin>
	</a-modal>
</template>

<script>
import { api } from '@/api/index.js';
import { ModalMixins } from '@/mixins';
function getBase64(file) {
	return new Promise((resolve, reject) => {
		const reader = new FileReader();
		reader.readAsDataURL(file);
		reader.onload = () => resolve(reader.result);
		reader.onerror = error => reject(error);
	});
}
export default {
	name: 'addSchoolModal',
	mixins: [ModalMixins],
	data() {
		return {
			confirmDirty: false,
			areaList: [],
			majorList: [],
			uploadFile: process.env.VUE_APP_API_BASE_URL + api.uploadFile,
			headers: {
				'X-AUTH-TOKEN': 'Basic ' + window.localStorage.getItem('token')
			}
		};
	},
	created() {},
	methods: {
		add(record) {
			this.visible = true;
			if (this.areaList.length == 0) {
				this.getAreasOrMajor('area');
			}
			if (this.majorList.length == 0) {
				this.getAreasOrMajor('major');
			}
			if (record) {
				this.title = '编辑学校';
				this.isAdd = false;
				this.mdl = { ...record };
				if (this.mdl.scoresAnalysis) {
					let scoresAnalysis = this.mdl.scoresAnalysis.split(';');
					let picList = scoresAnalysis.map((item, index) => {
						return {
							uid: index,
							status: 'done',
							name: 'image.png',
							url: process.env.VUE_APP_API_BASE_URL + item
						};
					});
					this.mdl.scoresAnalysis = [...picList];
				}
				this.init();
			} else {
				this.title = '新增学校';
				this.isAdd = true;
			}
		},
		init() {
			this.$nextTick(() => {
				this.form.setFieldsValue(
					this.$pick(this.mdl, 'adviseBothNo', 'adviseBothYes', 'adviseSingle', 'earlyNormalApproval', 'majorCode', 'nationalLine', 'schoolName', 'scoresAnalysis','dispensing_detail', 'areaCode')
				);
			});
		},
		close() {
			this.$emit('close');
			this.visible = false;
		},
		handleOk() {
			const _this = this;
			// 触发表单验证
			this.form.validateFields((err, values) => {
				// 验证表单没错误
				if (!err) {
					let { scoresAnalysis } = values;
					let parameter = { ...values };
					if (scoresAnalysis && scoresAnalysis.length > 0) {
						let picList = scoresAnalysis.map(item => item.url.replace(process.env.VUE_APP_API_BASE_URL, ''));
						parameter.scoresAnalysis = picList.join(';');
					}
					console.log('parameter', parameter);
					_this.confirmLoading = true;
					this.$postAction(api.saveOrUpdateSchool, Object.assign(parameter, !this.isAdd ? { id: this.mdl.id } : null))
						.then(res => {
							if (res.code == 200) {
								_this.$message.success('保存成功');
								_this.$emit('ok');
								_this.form.resetFields();
								_this.visible = false;
							}
						})
						.finally(() => {
							_this.confirmLoading = false;
						});
				}
			});
		},
		handleCancel() {
			this.close();
		},
		normPicListFile(e) {
			if (Array.isArray(e)) {
				return e;
			}
			if (e && e.fileList) {
				e.fileList.forEach(item => {
					let fileUrl = item.response && item.response.data ? item.response.data : null;
					if (!item.url && fileUrl) {
						item.url = fileUrl;
					}
				});
			}
			return e && e.fileList;
		},
		getAreasOrMajor(optiontype) {
			this.$getAction(this.$api.getAreasOrMajor, {
				optiontype
			}).then(da => {
				let list = [...da.data];
				if (optiontype == 'area') {
					this.areaList = list;
				} else {
					this.majorList = list;
				}
			});
		}
	}
};
</script>

<style scoped></style>
